$imgurl-base: "../../newimages/mall";
$gray: #c9caca;
$light-gray: #f5f5f5;
$black: #595757;
$light-black: #9fa0a0;
$red: #ff4739;
$blue: #1a58c8;
.wrapper{
	width:1170px;
	margin: 0 auto;
}
body{
	color:$black;
}	
a{
	color:$black;
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}
%inline-block{
	display:inline-block;
	*display:inline;
	*zoom:1;
}
%block-100{
	display:block;
	width:100%;
	height:100%;
}
.scroll-box{
	position:relative;
	padding:10px 0;
	border-top:1px solid $gray;
	border-bottom:1px solid $gray;
	ul{
		display: none;
		width:990px;
		margin: 0 auto;
		&.cur{
			display: block;
		}
		li{		
			width:165px;
			float: left;
			display: inline;
			text-align: center;
		}
		img{
			width:110px;
			height: 110px;
		}
	}
	i{
		position:absolute;
		display: block;
		width:29px;
		height: 41px;
		top:57px;
		&.pre{
			left:0;
			background:url(#{$imgurl-base}/i/icon-scroll-left.png) no-repeat;
		}
		&.next{
			right: 0;
			background:url(#{$imgurl-base}/i/icon-scroll-right.png) no-repeat;
		}
		a{
			font-size: 0;
			@extend %block-100;
		}
	}
}
.module{
	$orange: #ff9000;
	$pink: #ff7373;
	$light-blue: #66a6f5;
	color:$black;	
	.module-title{
		padding:10px 0 12px 2px;
		margin-top: 40px;
		font-size: 24px;
		border-bottom:3px solid;
	}
	.module-con{
		padding:18px 14px 30px 18px;
		border:1px solid $gray;
		border-top:none;
	}
	.module-con-l{
		width: 193px;
		height: 438px;
		float:left;
		.type{
			text-align: center;
			font-size: 30px;
			color: #fff;
			padding-top:47px;
			i{
				@extend %inline-block;
				padding-bottom: 6px;
				width:40px;
				height:35px;
			}
			span{
				@extend %inline-block;
				padding-top:10px;
				border-top:1px solid #fff;
			}
		}
		.type-list{
			width:177px;
			margin:0 auto;
			margin-top:20px;
		}
		ul{
			width:178px;
			margin-left:-1px;
		}
		li{
			width:88px;
			height:90px;
			float:left;
			background:#fff;
			display: inline;
			text-align: center;
			font-size: 12px;
			margin:0 0 1px 1px;	
			img{
				vertical-align: top;
				margin:6px 0;
			}
		}
	}
	.module-con-m{
		%width-height{
			width: 310px;
			height: 438px;
		}
		@extend %width-height;
		float:left;
		margin-left:14px;
		img{
			@extend %width-height;
		}
	}
	.module-con-r{		
		float:left;
		margin-left:42px;
		width:540px;
		overflow: hidden;
		ul{
			margin:-1px 0 0 -1px;
			width:100%;
		}
		li{
			width:179px;
			height: 218px;
			float: left;
			border-left:1px solid $gray;
			border-top:1px solid $gray;
		}
		dl{
			text-align: center;
		}
		dt{
			padding:10px 0 5px 0;
			font-size: 16px;
			font-weight: bold;
			span{
				font-weight: normal;
				font-size: 12px;
				color:$light-black;
				padding-top:6px;
				@extend %inline-block;
				vertical-align: top;
			}
		}
		dd{
			img{
				vertical-align: top;
				width:150px;
				height:150px;
			}
		}
	}
	&.orange{
		.module-con{
			padding-bottom:0;
		}
		.module-title{
			color:$orange;
			border-color:$orange;
		}
		.hot-list{
			margin-left: -18px;
			li{				
				float:left;
				display: inline;
				width:267px;
				margin-left: 20px;
			}
			img{
				width:265px;
				height:326px;
				border:1px solid $gray;
			}
			.txt{
				padding:8px 0 16px 0;
			}
			.name{				
				font-size: 14px;
			}
			.price{
				float:right;
				color:$red;
				font-size: 18px;
			}
		}
	}
	&.pink{
		.module-title{
			color:$pink;
			border-color:$pink;
		}
		.module-con-l{
	  		background: linear-gradient(top, $pink, #ffc7a4);
		}
		.type{
			padding-top:47px;
			i{
				width:40px;
				height:35px;
				background:url(#{$imgurl-base}/i/icon-control.png) no-repeat;
			}
		}
	}
	&.light-blue{
		margin-bottom: 50px;
		.module-title{
			color:$light-blue;
			border-color:$light-blue;
		}	
		.module-con-l{
	  		background: linear-gradient(top, $light-blue, #b3fbff);
		}	
		.type{
			padding-top:30px;
			i{
				width:61px;
				height:55px;
				background:url(#{$imgurl-base}/i/icon-life.png) no-repeat;
			}
		}
	}
}